<template>
	<div class="flex-col">
		<div style="margin-bottom: 50px;">
			<customer-Info  v-model="detailForm" v-if="detailForm.customerDetailVo" />
			<out-Car-Info v-model="detailForm" v-if="detailForm.outStorageVo" />
			<div v-if="detailForm.carOutStorage">
				<out-Improve-Info v-model="detailForm" ref='refImprove' v-if="!boole"/>
				<template v-else>
				  <view class="normal-login-container">
				
				    <view class="item-wrap" style="margin-bottom: 0">
				      <view class="lineBottom10">
				        <uni-section title="出库信息" type="line"/>
				      </view>
				
				      <view style="margin: 8rpx 20rpx 8rpx 20rpx">
				        <uni-forms ref="form"  label-position="top" :model="form"
				                   labelWidth="auto">
							<uni-forms-item label="出库时间:" name='outStorageTime' required>
							  <uni-datetime-picker  type="date" placeholder="请选择出库时间" return-type="string"
							    v-model="form.outStorageTime" />
							</uni-forms-item>
							<uni-forms-item label="出库里程(km):" name='outboundMileage' required>
							  <uni-easyinput  v-model="form.outboundMileage" placeholder="请输入出库里程"/>
						
							</uni-forms-item>
							<uni-forms-item label="出库里程附件:" name='outboundMileageOss' required>
									<image-common :disabled="!boole" :up-type="2" v-model="form.outboundMileageOss"/>
							</uni-forms-item>
							  <uni-forms-item label="出库油量(%):" name='outboundOilQuantity' required>
								<uni-easyinput  v-model="form.outboundOilQuantity" placeholder="请输入出库油量"/>
								
							  </uni-forms-item>
							  <uni-forms-item label="出库油量附件:" name='outboundOilQuantityOss' required>
								<image-common :disabled="!boole" :up-type="2" v-model="form.outboundOilQuantityOss"/>
							  </uni-forms-item>
				
							  <uni-forms-item label="上传交车单:" name='deliveryNoteOss' required>
								<image-common :disabled="!boole" :up-type="2" v-model="form.deliveryNoteOss"/>
							  </uni-forms-item>
							  <uni-forms-item label="附件:" name='attachmentOss'>
							  				<image-common :disabled="!boole" :up-type="2" v-model="form.attachmentOss"/>
							  </uni-forms-item>
							  
							  <uni-forms-item label="备注:" name='remark'>
									<uni-easyinput  v-model="form.remark" placeholder="请输入备注"/>	
							  </uni-forms-item>
				        </uni-forms>
				      </view>
				    </view>
				  </view>
				</template>
			</div>
			<!--审批流程-->
			<exam-flow v-if="flowId" :instanceId="flowId"/>
		</div>
		
		
		<view class="button-container" v-if="boole">
			<button class="btn-item" @click="submit(1)">保 存</button>
		  <button class="btn-item" @click="submit(2)">提 交</button>
		</view>
	</div>
</template>

<script>
	import customerInfo from '../compoents/customer.vue'
	import outCarInfo from '../compoents/outcar.vue'
	import outImproveInfo from '../compoents/outImprove.vue'
	import externalLeasingInfo from '../compoents/externalLeasing.vue'
	import {getOutstorageInfo,postOutstorage,insertCarOutStorage} from "@/api/storage/out.js";
export default {
  name: 'outstorageInfo',//详情
  components: {customerInfo,outCarInfo,outImproveInfo,externalLeasingInfo},
  watch: {
	 form:{
		 deep:true,
		 handler(val){
			 this.form = val
		 },
	 },
	 // detailForm:{
		//  deep:true,
		//  handler(val){
		// 	 this.detailForm = val
		//  },
		//  immediate:true
	 // }
  },
  data() {
    return {
		detailForm:{},
		flowId:'',
		id:'',
		inboundId:'',
		isShow:false,
		boole:true,
		form:{
			outboundMileage: null, //出库里程
			outboundMileageOss: null, //出库里程附件
			outboundOilQuantity: null, //入库油量
			outboundOilQuantityOss: null, //出库油量附件
			attachmentOss: null, //附件
			remark: null, //备注,
			saveFlag: 0,
			outStorageTime: null, //出库时间
		},
		rules: {
			outboundMileage: {
				rules: [
				  {
					required: true,
					errorMessage: "请输入出库里程",
					validateTrigger: "blur",
				  },
				  {
				    validateFunction: function (rule, value, data, callback) {
						console.log(value,'onReady')
				      const regex = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/
				      console.log(regex.test(value))
					  if (!regex.test(value)) {
				        callback('请输⼊正确的格式,可保留两位⼩数')
				      }
				      return true
				    },
				  },
				],
			},
            outboundMileageOss:{
				rules: [
				  {
					required: true,
					errorMessage: "请上传出库里程表照片",
					validateTrigger: "blur",
				  },
				],
			},
			outStorageTime:{
				rules: [
				  {
					required: true,
					errorMessage: "请选择出库时间",
					validateTrigger: "change",
				  },
				],
			},
			outboundOilQuantity:{
				rules: [
				  {
					required: true,
					errorMessage: "请输入出库油量",
					validateTrigger: "blur",
				  },
				  {
				    validateFunction: function (rule, value, data, callback) {
				      const regex =  /^[0-9]*$/
					  console.log(value)
				      if (!regex.test(value)) {
				        callback('请输入正整数')
				      }
				      return true
				    },
				  }, 
				],
			},
			outboundOilQuantityOss:{
				rules: [
				  {
					required: true,
					errorMessage: "请上传出库油量照片",
					validateTrigger: "blur",
				  },
				   
				],
			},
			deliveryNoteOss:{
				rules: [
				  {
					required: true,
					errorMessage: "请上传上传交车单",
					validateTrigger: "blur",
				  },
				],
			}
		},
	};
  },
    computed:{
  	  a(){  
  		 let pasr =  this.detailForm.carOutStorage && this.boole
  		 if(pasr){
  			 this.$nextTick(()=>{
					  if(this.$refs.form.formRules.outboundMileage){
						  return
					  }else{
						  this.$refs.form.setRules(this.rules)
					  }
  			 		  
  			 })
  		 }
  	  }
    },
  onLoad(op) {
    this.flowId = op?.flowId;
	this.id = op?.id
	this.inboundId = op?.inboundId
	if(op?.viewType==0){
		this.boole = false
	}else{
		this.boole = true	
		console.log('金老了')
	}
	this.getInfo()
  },
  onReady(){	
	  console.log('哈哈哈')
	  // wx.nextTick(()=>{
	  // 		  console.log(this,'asdas')
	  // 		  this.$refs.form.setRules(this.rules)
	  // })
 
  },
  mounted() {
	  console.log(this.boole)
	  console.log(this,'asdas')
  },
  methods: {
	  getInfo(){
		  getOutstorageInfo(this.id).then((res)=>{
			  if(res.code==200){
				   this.flowId = res.data?.carOutStorage?.flowId
				  for (const key in res.data) {
				    this.$set(this.detailForm, key, res.data[key]);
				  }
				  this.$set(this.detailForm,'inboundId',this.inboundId)
				  this.$set(this.detailForm,'source',this.source)
				  for (const key in res.data?.carOutStorage) {
				    this.$set(this.form, key, res.data.carOutStorage[key]);
				  }
				  // wx.nextTick(()=>{
				  // 		  console.log(this,'asdas')
				  // 		  this.$refs.form.setRules(this.rules)
				  // })
			  }
		  })
	  },
	  submit(val){	  
		  if(val==2){
			  this.$refs.form
			      .validate()
			      .then((res) => {
					  for (const key in this.form) {
						this.$set(this.detailForm.carOutStorage, key, this.form[key]);
					  }
					   postOutstorage(this.detailForm).then((res)=>{
						  if (res.code === 200) {
							  uni.$emit("refreshClue", true);
							this.$modal.msgSuccess("提交成功");
							setTimeout(() => {
							   // let url = `/pages/StoragePage/outStorage/list`
							   this.$tab.navigateBack()
							}, 1000);
						  }
					  })
			      })
		  }else{
			  for (const key in this.form) {
			    this.$set(this.detailForm.carOutStorage, key, this.form[key]);
			  }
			  insertCarOutStorage(this.detailForm).then((res)=>{
				  if (res.code === 200) {
					  uni.$emit("refreshClue", true);
					this.$modal.msgSuccess("提交成功");
					setTimeout(() => {
						// let url = `/pages/StoragePage/outStorage/list`
						this.$tab.navigateBack()
					}, 1000);
				  }
			  })
		  }
		  
	  }
  },
};
</script>

<style>
	
</style>